import * as echarts from 'echarts'

const Pie3Option = ({ title, colorList, seriesdata }) => {
  return {
    title: {
      text: title,
      itemGap: 20,
      top: '35%',
      left: '50%',
      textStyle: {
        fontSize: '30',
        color: 'black',
      },
      textAlign: 'center',
    },
    tooltip: {
      trigger: 'item',
      formatter: '{b}占比{c}%',
      borderWidth: 0,
      borderRadius: 12,
    },
    legend: {
      bottom: '20',
      orient: 'horizontal',
      right: 'center',
      width: 300,
      textStyle: {
        color: 'black',

        rich: {
          a: {
            width: 45,
          },
          0: {
            color: colorList[0].c1,
            width: 20,
          },
          1: {
            color: colorList[1].c1,
            width: 20,
          },
          2: {
            color: colorList[2].c1,

            width: 20,
          },
          3: {
            color: colorList[3].c1,

            width: 14,
          },
          4: {
            color: colorList[3].c1,
            width: 20,
          },
          5: {
            color: colorList[3].c1,
            width: 20,
          },
        },
      },
      formatter: function (name) {
        let index = seriesdata.findIndex((item) => item.name == name)
        let value = seriesdata[index].value
        return '{a|' + name + '}' + '  {' + index + '|' + value + '%}'
      },
      borderWidth: 0,
      itemWidth: 18,
      itemHeight: 5,
      borderRadius: 5,
    },
    color: colorList,
    series: [
      {
        type: 'pie',
        radius: ['45%', '65%'],
        center: ['50%', '40%'],
        avoidLabelOverlap: false,
        itemStyle: {
          borderColor: '#fff',
          borderWidth: 2,
          color: function (params) {
            return new echarts.graphic.LinearGradient(1, 0, 0, 0, [
              {
                offset: 1,
                color: colorList[params.dataIndex].c1,
              },
              {
                offset: 0,
                color: colorList[params.dataIndex].c2,
              },
            ])
          },
        },
        label: {
          show: false,
          position: 'center',
        },
        emphasis: {
          label: {
            show: false,
            fontSize: '40',
            fontWeight: 'bold',
          },
        },
        labelLine: {
          show: false,
        },
        data: seriesdata,
      },
    ],
  }
}

export { Pie3Option }
